<%@page language="java" contentType="text/html; charset=utf-8"%>
<%@include file="/tagDeclare.jsp"%>
<%@include file="/headDeclare.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript"
	src="http://api.map.baidu.com/api?v=2.0&ak=rhPVE2HvyR3DbvYWe7DOWGS4"></script>
<style type="text/css">
fieldset,legend,form,table,tr,td,textarea {
	margin: 0;
	padding: 0
}

form label {
	font-weight: bold;
}

.td-right {
	text-align: right;
}

table {
	margin: 10px 10px
}

;
td {
	line-height: 40px;
}

input[type="text"] {
	width: 250px;
}

input[type="password"] {
	width: 250px;
}

input[type="textarea"] {
	width: 250px;
}

body,html,#main {
	width: 100%;
	height: 100%;
	overflow: hidden;
	margin: 0;
	font-family: "微软雅黑";
}

#wall_div {
	width: 100%;
	height: 40%;
	overflow: hidden;
	margin: 0;
	font-family: "微软雅黑";
	float: left;
}

#allmap {
	width: 100%;
	height: 60%;
	overflow: hidden;
	margin: 0;
	font-family: "微软雅黑";
	float: left;
}
</style>

<script type="text/javascript">
var wid = "";
	  $(document).ready(function(){
		  
		  $().piroBox({
				my_speed: 400, //animation speed
				bg_alpha: 0.1, //background opacity
				slideShow : true, // true == slideshow on, false == slideshow off
				slideSpeed : 4, //slideshow duration in seconds(3 to 6 Recommended)
				close_all : '.piro_close,.piro_overlay'// add class .piro_overlay(with comma)if you want overlay click close piroBox
				
			});
		  
		  $("img").lazyload({
			     placeholder : "images/loading.gif", //加载图片前的占位图片
			     effect      : "fadeIn" //加载图片使用的效果(淡入)
			});
		  
		//文件上传组件
		     $("#file_upload").uploadify({   
               'height'        : 27,    
 	          'width'         : 80,     
 	          'buttonText'    : '添加附件',   
 	          'queueID': 'fileQueue', 
 	          'removeCompleted': true,         //上传完毕上传列表是否去除 
 	          'fileSizeLimit': '20MB',          //上传文件大小设置 单位可以是B、KB、MB、GB 
               'swf'           : 'js/uploadify/uploadify.swf',   
 	          'uploader'      : '<%=basePath%>uploadImages.do',   
 	          'auto'          : false,   
 	          'formData'      : {'wid':''},  
 	          'fileTypeExts'  : '*.jpg;*.png;*.gif',   
 	          'multi'			: true,
 	          'onUploadStart' : function(file) {   
 	                $("#file_upload").uploadify("settings","formData", {'wid':wid});   
 	           },   
 	          'onUploadSuccess':function(file, data, response){ 
				  var json=eval("("+data+")"); //转换为json对象
        		  if(json.code == 0){
  	        		  $('#' + file.id).find('.data').html(' 上传完毕');
  	        	  }else{
  	        		  $('#' + file.id).find('.data').html(json.msg);
  	        	  }
 	           },   
 	          'onQueueComplete':function (stats){
        		var wallId = $("#wallId").val();
 				location.href = "<%=basePath%>wall/view.do?id="+wallId;
 	          }
		      });
			
	  });


	  
	   function startUpload(){
		   wid = $("#wallId").val();
		  $('#file_upload').uploadify('upload','*');   
	   }  

	   //返回列表页面
// 	   function btn_return(){
// 		    var qs = $("#qs").val();
<%-- 	    	window.location.href="<%=basePath%>wall/list.do?" + qs; --%>
// 		}
	  function delImage(id){
		  var url = "<%=basePath%>image/delete.do";
	      	$.post(url,{id:id},function(data){
	  			var responseJson = eval('(' + data + ')');
	  			   if(responseJson.code==0)
	  			   {
	  					$("#error_label").text("错误信息：" + responseJson.message);
	  	         		$("#p_error").show();
	  	         		return;
	  			   }else{
	  				   var wallId = $("#wallId").val();
	  					location.href = "<%=basePath%>wall/view.do?id="+wallId;
					}
			});
		}
	  
	  
</script>
</head>
<body>
	<div id="main">
		<div id="allmap"></div>

		<div id="wall_div" style="overflow-y: auto; overflow-x: auto;">
			<!-- 			<fieldset> -->
			<legend>墙体信息：</legend>
			<div style="float: left; width: 35%;">
				<input id="qs" name="qs" type="hidden" value="${qs}" /> 
<%-- 				<input type="hidden" name="role" id="role" value="${username_attr.role }" /> --%>
				<input type="hidden" name="wallId" id="wallId" value="${wall.id }" />
				<input type="hidden" name="high" id="high" value="${wall.high }" />
				<input type="hidden" name="width" id="width" value="${wall.width }" />
				<input type="hidden" name="area" id="area" value="${wall.area }" />
				<input type="hidden" id="locationX" value="${wall.locationX }" />
				<input type="hidden" id="locationY" value="${wall.locationY }" />
				<input type="hidden" name="username" id="username"
					value="${wall.username }" /> <input id="addr" type="hidden"
					value="${wall.province }${wall.city }${wall.county }${wall.address }" />
				<input type="hidden" name="city" id="city" value="${wall.city }" /> 
				<table>
					<tr>
						<td class="td-right"><label for="province">省市县：</label></td>
						<td colspan="3" >${wall.province }${wall.city }${wall.county }</td>
					</tr>
					<tr>
						<td class="td-right"><label for="address">地址：</label></td>
						<td colspan="3">${wall.address }</td>
					</tr>
					<tr>
						<td class="td-right"><label for="bugLevel">规格：</label></td>
						<td>高:${wall.high }(m)*宽:${wall.width }(m)=面积:${wall.area }(m<sup>2</sup>)
						</td>
						<td class="td-right"><label for="username">姓名：</label></td>
						<td>${wall.username }</td>
					</tr>
					<tr>
						<td class="td-right"><label for="tel">电话：</label></td>
						<td>${wall.tel }</td>
						<td class="td-right"><label for="status">租赁类别：</label></td>
						<td><c:if test="${wall.status ==0 }">空白</c:if> <c:if
								test="${wall.status ==1 }">自租</c:if> <c:if
								test="${wall.status ==2 }">他租</c:if></td>
					</tr>
					<tr>
						<td class="td-right"><label for="status">客户名称：</label></td>
						<td>${wc.cname }</td>
						<td class="td-right"><label for="status">行业名称：</label></td>
						<td><c:out value="${tradeName } " /> <!-- 							<select id="trade" name="trade" style="width: 100px;" -->
							<!-- 								disabled="disabled"> --> <!-- 									<option value="" style="color: red;">--选择行业--</option> -->
							<%-- 									<c:forEach var="trade" items="${tradeList }"> --%>
							<%-- 										<option value="${trade.itemName }" --%> <%-- 											<c:if test="${trade.itemName eq wc.trade}">selected="selected"</c:if>>${trade.itemValue }</option> --%>
							<%-- 									</c:forEach> --%> <!-- 							</select> --></td>
					</tr>
					<tr>
						<td class="td-right"><label for="status">租赁时间：</label></td>
						<td>${wc.rentTime}</td>
						<td class="td-right"><label for="status">到期时间：</label></td>
						<td>${wc.endTime}</td>
					</tr>

					<tr>
						<td class="td-right"><label for="lv">评估等级：</label></td>
						<td><c:if test="${wall.lv ==0 }">优</c:if> <c:if
								test="${wall.lv ==1 }">良</c:if> <c:if test="${wall.lv ==2 }">中</c:if>
						</td>
						<td class="td-right"><label for="status">价格：</label></td>
						<td>${wall.price }</td>
					</tr>
					<tr>
						<td class="td-right"><label for="images">备注：</label></td>
						<td>${wall.memo}</td>
					</tr>
				</table>
			</div>
			<div style="float: left; width: 40%;">
				<c:forEach items="${images }" var="image">
					<a href="javascript:delImage('${image.id }')"
						style="position: absolute; padding-left: 40px;" title="删除"> <img
						src="images/del.png" style="width: 20px; height: 20px;" />
					</a>
					<a href="${image.url }" class="pirobox_gall" title="${image.name }">
						<%-- 							<img src="${image.url }" style="width: 60px; height: 60px;" /> --%>
						<img src="images/loading.gif" data-original="${image.url }"
						style="width: 50px; height: 50px;" />
					</a>
				</c:forEach>
			</div>
			<div id="uploadDiv" style="width: 24%; float: left;">
				<!-- 					<fieldset> -->
				<input type="file" name="uploadify" id="file_upload" /> <label
					id="fileQueue"></label> <a onclick="startUpload();"
					href="javascript:void(0);">上传</a> <a
					href="javascript:$('#file_upload').uploadify('cancel', '*')">取消</a>
				<!-- 			        </fieldset> -->
			</div>
			<!-- 			</fieldset> -->
		</div>

	</div>
</body>
</html>

<script type="text/javascript">
	var map = null;
	//百度地图API功能
	map = new BMap.Map("allmap"); // 创建Map实例
	if($("#city").val()==""){
		map.centerAndZoom(new BMap.Point($("#locationY").val(),$("#locationX").val()),9);
	}else{
		map.centerAndZoom($("#city").val(), 9); // 初始化地图,设置中心点坐标和地图级别
	}
	map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
	map.setCurrentCity("福州"); // 设置地图显示的城市 此项是必须设置的

	map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用

	var myGeo = new BMap.Geocoder();
	var info = new Array($("#addr").val(), $("#high").val(), $("#width").val(),
			$("#area").val(), $("#username").val());
	geocodeSearch(info,$("#city").val());

	var role = document.getElementById("role").value;

	function geocodeSearch(info,city) {
		myGeo.getPoint(info[0], function(point) {
			if (point) {
				addMarker(info, point, new BMap.Label(info[0], {
					offset : new BMap.Size(20, -10)
				}));
			}
		}, city);
	}
	// 编写自定义函数,创建标注
	function addMarker(info, point, label) {
		marker = new BMap.Marker(point);
		//marker.enableDragging();
		var telContent = "";
		if (role == 1)
			telContent = " 联系方式：" + 222;
		marker
				.addEventListener(
						"click",
						function() {
							var sContent = "<div width = '320'><h4 style='margin:0 0 5px 0;padding:0.2em 0'>"
									+ info[0]
									+ "</h4>"
									+ "<p style='margin:0;line-height:1.5;font-size:13px;'>地址："
									+ info[0]
									+ "&nbsp;&nbsp;</p>"
									+ "<p style='margin:0;line-height:1.5;font-size:13px;'>规格(m)：宽"
									+ info[2]
									+ "*高"
									+ info[1]
									+ "=面积"
									+ info[3]
									+ "(m<sup>2</sup>)</p>"
									+ "<p style='margin:0;line-height:1.5;font-size:13px;'>姓名："
									+ info[4] + telContent + "</p>" + "</div>";
							var infoWindow = new BMap.InfoWindow(sContent);
							this.openInfoWindow(infoWindow);
							//图片加载完毕重绘infowindow
							// 			   document.getElementById('imgDemo').onload = function (){
							infoWindow.redraw(); //防止在网速较慢，图片未加载时，生成的信息框高度比图片的总高度小，导致图片部分被隐藏
							// 			   }
						});
		map.addOverlay(marker);
		marker.setLabel(label);

	}
</script>

